export {}

// 1. 封装一下格式化时间的函数
const formatTime = (date?: Date | string): string => {
  // 判断有没有传值, 没有传值 取当前时间戳当值
  if (!date) date = new Date()
  // 判断传递数据类型为字符串 转换成时间戳
  if (typeof date === 'string') date = new Date(date)
  const h = date.getHours()
  const m = date.getMinutes()
  const s = date.getSeconds()
  return `${h}:${m}:${s}`
}

// 定义类型 对象和数组
type Data = {
  count: number
  time: string
}

type List = Array<Data>

const KEY = 'ts-data'
// 从本地取历史记录
const getData = () => {
  const str = localStorage.getItem(KEY)
  return JSON.parse(str || '[]') as List
}

// 存历史记录到本地
const updateData = () => {
  // 先获取本地记录,再拼接到本地记录上 存到本地
  const list = getData()
  const lastItem = list[list.length - 1]
  list.push({
    count: lastItem ? lastItem.count + 1 : 1,
    time: formatTime()
  })
  localStorage.setItem(KEY, JSON.stringify(list))
}
// 渲染
const render = () => {
  updateData()
  const data = getData()
  const app = document.querySelector('#app') as HTMLDivElement
  app.innerHTML = data.map(item => `次数: ${item.count}, 时间: ${item.time}`).join('<br/>')
}

render()